// JavaScript Document - rollover.js
var bear ={
	img_name:'',
	type			:	'personalized-design-a-bear',
	step			:	'bear',
	errMsg			:	{
							selectBar		 : "Please select a bear to continue next step!",
							selectEmbroidery : "Please select Bear and hooide to continue next step ",
							selectCard		 : "Please fillup step 1, step 2 and Step 3 correctly",
							selectIcon		 : "Please let us know which of the following you wish to add:\n- Small Heart \n- Small Bear",
							addMessage		 : "Please enter the text you would like in the Hoodie",
							addName			 : "Please enter the name you would like on the Hoodie",
							setCardText		 :  "Please fillup the card section correctlry"
						},
	gift			:	{
							bear:null,
							hoodie: null,
							type:null,
								/* Message Bear section */
							icon: null,
							kiss:'No',
							message:null,
								/* Name Bear Section */
							name:null,
								/* Card Section */
							card:null,
							front_text_1 : "",
							front_text_2 : "",
							inside_text_1: "",
							inside_text_2: "",
							inside_text_3: "",
								/* Special Instruction */
							special_instruction: ""
						},
	slide			:	{
							bear:"personalized-bear",
							hoodie:"personalized-hoodie",
							embroidery:"personalized-embroidery",
							card:"personalized-cards"
						},
	animate			:{
						bear:null,
						hoodie:null,
						embroidery:null,
						card:null,
						message_bear:null,
						bear_type:null,
						name_bear:null,
						message_bear_pan: null,
						name_bear_pan: null,
						personalize_card : null
					},
	confirmOrder : function()
	{
		var ord = "";
		ord		+= "bear_type|@|" + bear.type;
		ord		+= "|#|bear|@|" + bear.gift.bear;
		ord		+= "|#|hoodie|@|" + bear.gift.hoodie;
		ord		+= "|#|type|@|" + bear.gift.type;
		if( bear.gift.type == 'message' )
		{
			ord		+= "|#|icon|@|" + bear.gift.icon;
			ord		+= "|#|kiss|@|" + bear.gift.kiss;
			ord		+= "|#|message|@|" + bear.gift.message;
		}
		else
		{
			ord		+= "|#|name|@|" + bear.gift.name;
		}
		ord		+= "|#|card|@|" + bear.gift.card;

		ord		+= "|#|front_text_1|@|" + bear.gift.front_text_1;
		ord		+= "|#|front_text_2|@|" + bear.gift.front_text_2;
		ord		+= "|#|inside_text_1|@|" + bear.gift.inside_text_1;
		ord		+= "|#|inside_text_2|@|" + bear.gift.inside_text_2;
		ord		+= "|#|inside_text_3|@|" + bear.gift.inside_text_3;
		ord		+= "|#|special_instruction|@|" + bear.gift.special_instruction;	

		$('order_data').set('value',ord);
		/* Submit form */
		$('orderform').submit();
	},
	toggoler:function()
	{
		bear.step = this.get('id');
		bear.jump();		
	},	
	validation : function()
	{
		var noErr = true; 
		switch( bear.step )
		{
			case "hoodie"	:
								noErr = ( bear.gift.bear == null ) ? false : true;
								break;
			case "embroidery"	:
								noErr = ( bear.gift.bear == null ) ? false : true;
								if( noErr  ) noErr = ( bear.gift.hoodie == null ) ? false : true;
								break;
			case "card"	:	
								if( bear.gift.type == "message")
								{
									noErr = (   bear.gift.message == null ) ? false : true;
									
								}
								else if ( bear.gift.type == "name" )
								{
									noErr = ( bear.gift.name == null || bear.gift.name == "" ) ? false : true;
								}
								else noErr = false;
								break;
		}

		return noErr;
	},
	setMessage : function(msg )
	{
		alert(msg);
	},
	jump : function ()
	{
		switch( bear.step )
		{
			case 'bear':	
								 $(bear.slide.bear).setStyle('display','block');
                                 $(bear.slide.hoodie).setStyle('display','none');
                                 $(bear.slide.embroidery).setStyle('display','none');
                                 $(bear.slide.card).setStyle('display','none');
								break;
			case 'hoodie':	
								if( bear.validation() )
								{
									$(bear.slide.bear).setStyle('display','none');
                                    $(bear.slide.hoodie).setStyle('display','block');
                                    $(bear.slide.embroidery).setStyle('display','none');
                                    $(bear.slide.card).setStyle('display','none');
								} else bear.setMessage(bear.errMsg.selectBar);
								break;
			case 'embroidery':
								if( bear.validation() )
								{	if( bear.gift.type == 'message')
									{
										$('message_bear').setStyle('display','block');
										$('name_bear').setStyle('display','none');	
									}
									else if( bear.gift.type == 'name')
									{
										$('message_bear').setStyle('display','none');
										$('name_bear').setStyle('display','block');	
									}
									 $(bear.slide.bear).setStyle('display','none');
                                    $(bear.slide.hoodie).setStyle('display','none');
                                    $(bear.slide.embroidery).setStyle('display','block');
                                    $(bear.slide.card).setStyle('display','none');
								} else bear.setMessage(bear.errMsg.selectEmbroidery);
								break;
			case 'card':	
								if( bear.validation() )
								{
									$('message_bear').setStyle('display','none');
									$('name_bear').setStyle('display','none');	

                                    $(bear.slide.bear).setStyle('display','none');
                                    $(bear.slide.hoodie).setStyle('display','none');
                                    $(bear.slide.embroidery).setStyle('display','none');
                                    $(bear.slide.card).setStyle('display','block');

									if( o_card == null )
									{
										$(bear.slide.card).setStyle('display','block');
									}
									else
									{
										$('personalize_a_card').setStyle('display','block');
									}
								}else bear.setMessage(bear.errMsg.selectCard);
								break;
		}
	},
	selectBear : function ()
	{
		var id = this.get("id");
		bear.gift.bear = this.get('longdesc');
		var src = this.get("src").replace('/80/', '/110/');
		$("bear_pan_images").set("src",baseurl + '/images/ajax-loader.gif');	
		$("bear_pan_images").set("src",src);
		bear.appear($("bear_pan_images"));		
		$("bear_pan_images_title").set("text",$(id).get("alt"));
	},
	selectHoodie : function ()
	{
		var id = this.get("id");
		var arr = id.split('_');
		bear.gift.hoodie = arr[1];
		var src = baseurl + "/uploads/filemanager/" + $(id).get("longdesc");
		$("hoodie_pan_images").set("src", baseurl + '/images/ajax-loader.gif');	
		$("hoodie_pan_images").set("src",src);
		bear.appear($("hoodie_pan_images"));		
		$("hoodie_pan_images_title").set("text",$(id).get("alt"));
	},
	selectBearType : function()
	{	
		if (this.get('id') == 'message-bear' )
		{
			bear.gift.type = 'message';
			$('message_bear').setStyle('display','block');
			$('name_bear').setStyle('display','none');
			//bear.animate.name_bear_pan.hide();
            $('name_bear_pan').setStyle('display','none');
            $('message_bear_pan').setStyle('display','block');
			
		}		
		else if (this.get('id') == 'name-bear')
		{
			bear.gift.type = 'name';
			$('message_bear').setStyle('display','none');
			$('name_bear').setStyle('display','block');

            $('name_bear_pan').setStyle('display','block');
            $('message_bear_pan').setStyle('display','none');

		}
		else if( this.get('id') == 'MessageBearBack' || this.get('id') == 'NameBearBack')
		{
			$('message_bear').setStyle('display','none');
			$('name_bear').setStyle('display','none');	
		}
	},
	selectIcon : function()
	{
		bear.gift.icon = this.get('id');
		if( bear.gift.icon == "small_star")
		{
			$('icon_pan').set("text","Small Star");
			$('icon_pan').addClass('addstar');
			$('icon_pan').removeClass('addheart');
		}
		else
		{
			$('icon_pan').set("text","Small Heart")
			$('icon_pan').addClass('addheart');
			$('icon_pan').removeClass('addstar');
		}
		bear.appear($$('.icon_pan'));
	},
	addKiss : function()
	{
		bear.gift.kiss =  (this.get('checked')) ? 'Yes' : 'No';
		if( bear.gift.kiss == "Yes")
		{
			$$('.kiss_pan').set("text"," Kisses");
			$$('.kiss_pan').addClass('addkiss');
			bear.appear($$('.kiss_pan'));
		}
		else
		{
			$$('.kiss_pan').set("text","");
			$$('.kiss_pan').removeClass('addkiss');
		}
	},
	addMessage : function ()
	{
		bear.gift.message = ( this.defaultValue == this.get('value') ) ? null : this.get('value');
		bear.appear($$('.message_pan'));
	},
	addMessagePan : function()
	{
		$$('.message_pan').set("text",this.get('value'));
	},
	addName :function ()
	{
		bear.gift.name = ( this.defaultValue == this.get('value') ) ? null : this.get('value');
		bear.appear($$('.name_pan'));
	},
	addNamePan : function()
	{
		$$('.name_pan').set("text",this.get('value'));
	},
	appear : function(obj)
	{
		obj.setOpacity(0).set('tween', {duration:1500}).fade('in'); 
	},
	disappear : function(obj)
	{
		obj.setOpacity(0).set('tween', {duration:1500}).fade('out'); 
	},
	embroideryComplete : function ()
	{
		if(bear.gift.type == "message")
		{
			/*if( bear.gift.icon == null || bear.gift.icon == "")
			{
				alert( bear.errMsg.selectIcon);
			}
			else*/ if( bear.gift.message == null || bear.gift.message == "")
			{
				alert( bear.errMsg.addMessage);
			}
			else
			{
				$('message_bear').setStyle('display','none');
				$('name_bear').setStyle('display','none');	
			}
		}
		else
		{
			if( bear.gift.name == null ||  bear.gift.name == "" )
			{
				alert( bear.errMsg.addName);
			}
			else
			{
				$('message_bear').setStyle('display','none');
				$('name_bear').setStyle('display','none');	
			}
		}
	},
	selectCard : function()
	{
		var id = this.get('id');
		var arr = id.split('_');
		bear.gift.card = arr[1];
		var src = baseurl + "/common/get_image/"+this.get('longdesc') + "/251/fix";
		$('personalize_a_card_left').setStyle('background','url(' + src + ') no-repeat');
		$(bear.slide.card).setStyle('display','none');
		$('personalize_a_card').setStyle('display','block');
	},
	chnageCard: function ()
	{	
	    $(bear.slide.card).setStyle('display','block');
		$('personalize_a_card').setStyle('display','none');
	},
	setCardText : function()
	{
		var name = this.get('name');
		var text = this.get('value');
		$(name).set('text',text);

		if( name == "front_text_1" ) bear.gift.front_text_1 = text;
		if( name == "front_text_2" ) bear.gift.front_text_2 = text;
		if( name == "inside_text_1" ) bear.gift.inside_text_1 = text;
		if( name == "inside_text_2" ) bear.gift.inside_text_2 = text;
		if( name == "inside_text_3" ) bear.gift.inside_text_3 = text;

		$$('.p_' + name).set('text',text);
		bear.appear($$('.p_' + name));


	},
	confirmCardText : function ()
	{ 
			bear.gift.inside_text_1 == "" || bear.gift.inside_text_2 == "" || bear.gift.inside_text_3 == ""	
		if( false )
		{
			bear.setMessage(bear.errMsg.setCardText);
		}
		else
		{
			if(confirm('Please confirm your order'))
			{
				$('personalize_a_card').setStyle('display','none');
				$('orderform').setStyle('display','block');
				bear.appear($('orderform'));
				bear.confirmOrder();
			}
		}
		
	},	
	specialInstruction : function(){
							bear.gift.special_instruction = this.value;
						},
	init: function(){

		$$('.personalized-btn').addEvent('click',bear.toggoler);
	
		/* Bear type */
		bear.type = $('bear_type').get('value');
		
		/* Select Bear */
		$$('.bear').addEvent('click',bear.selectBear);
		$$('.hoodie').addEvent('click',bear.selectHoodie);

		/* Embroidery */

		// Message Bear
		$$('.personalize_bear_type').addEvent('click',bear.selectBearType);
		$$('.back').addEvent('click',bear.selectBearType);
		$$('.icon_type').addEvent('click',bear.selectIcon);
		$$('#kiss').addEvent('click',bear.addKiss);
		$('message').addEvent('blur',bear.addMessage);
		$('message').addEvent('keyup',bear.addMessagePan);
		$('MessageBearOk').addEvent('click',bear.embroideryComplete);
		// Name Bear
		$('name').addEvent('blur',bear.addName);
		$('name').addEvent('keyup',bear.addNamePan);
		$('NameBearOk').addEvent('click',bear.embroideryComplete);
		$$('.special_instruction').addEvent('blur',bear.specialInstruction);
		
		/* Card Section */
		$$('.card').addEvent('click',bear.selectCard);
		$$('.text-box').addEvent('keyup',bear.setCardText);
		$('confirmCardText').addEvent('click',bear.confirmCardText);
		$('selectAnotherCard').addEvent('click',bear.chnageCard);
			
		/* FXZ */
         $(bear.slide.hoodie).setStyle('display','none');
         $(bear.slide.embroidery).setStyle('display','none');
         $(bear.slide.card).setStyle('display','none');

		/*bear.animate.bear =  new Fx.Slide(bear.slide.bear);
		bear.animate.hoodie =  new Fx.Slide(bear.slide.hoodie).hide();
		bear.animate.embroidery =  new Fx.Slide(bear.slide.embroidery).hide();
		bear.animate.card =  new Fx.Slide(bear.slide.card).hide();	
		//bear.animate.message_bear =  new Fx.Slide('message_bear').hide();	
		//bear.animate.name_bear =  new Fx.Slide('name_bear').hide();	
		bear.animate.bear_type =  new Fx.Slide('select_bear_type');	
		
		bear.animate.message_bear_pan =  new Fx.Slide('message_bear_pan').hide();	
		bear.animate.name_bear_pan =  new Fx.Slide('name_bear_pan').hide();	*/
		
		bear.gift.bear = o_bear;
		bear.gift.hoodie = o_hoodie;
		bear.gift.type = o_type;
		bear.gift.icon = o_icon;
		bear.gift.kiss = o_kiss;
		bear.gift.message = o_message;
		bear.gift.name = o_name;

		if( bear.gift.type == 'message')
		{
			if( bear.gift.icon == "small_star")
			{
				$('icon_pan').set("text","Small Star");
				$('icon_pan').addClass('addstar');
				$('icon_pan').removeClass('addheart');
			}
			else
			{
				$('icon_pan').set("text","Small Heart")
				$('icon_pan').addClass('addheart');
				$('icon_pan').removeClass('addstar');
			}
			bear.appear($$('.icon_pan'));

			if( bear.gift.kiss == 'Yes' )
			{
				$$('.kiss_pan').set("text"," Kiss");
				$$('.kiss_pan').addClass('addkiss');
				bear.appear($$('.kiss_pan'));
			}
			$$('.message_pan').set("text",bear.gift.message);
			 $('message_bear_pan').setStyle('display','block');
		}
		else if( bear.gift.type == 'name')
		{
			$$('.name_pan').set("text",bear.gift.name);
            $('name_bear_pan').setStyle('display','block');
		}

		bear.gift.card = o_card;
		bear.gift.front_text_1	=  o_front_text_1;
		bear.gift.front_text_2	=  o_front_text_2;
		bear.gift.inside_text_1 = o_inside_text_1;
		bear.gift.inside_text_2 = o_inside_text_2;
		bear.gift.inside_text_3 = o_inside_text_3;
		$$('.p_front_text_1').set('text',o_front_text_1);
		$$('.p_front_text_2').set('text',o_front_text_2);
		$$('.p_inside_text_1').set('text',o_inside_text_1);
		$$('.p_inside_text_2').set('text',o_inside_text_2);
		$$('.p_inside_text_3').set('text',o_inside_text_3);


		if( bear.type == 'personalized-design-a-bear')
		{
			bear.errMsg.selectEmbroidery = "Please select Bear and Jumper to continue next step ";
			bear.errMsg.addMessage	= "Please enter the text you would like in the Jumper";
			bear.errMsg.addName		= "Please enter the name you would like on the Jumper";
		}

	}
}
window.addEvent('domready', bear.init);
